<template>
  <div class="container" >
    <!-- {{cutPageIndex}}
    {{selectedDepart}} -->
    <DepartTree v-show="cutPageIndex" />
    <PersonList v-if="selectedDepart" />
  </div>
</template>

<script>
import {
  mapState,
} from 'vuex'

import DepartTree from './components/DepartTree'
import PersonList from './components/PersonList'

export default {
  components: {
    DepartTree,
    PersonList,
  },

  computed: {
    ...mapState('depart', [
      'selectedDepart',
    ]),
    cutPageM () {
      return this.$store.state.cutPageM
    },
  },
  watch: {
    cutPageM () {
      if (localStorage.getItem('cutPageM')) {
        if (localStorage.getItem('cutPageM') == 'table') {
          this.cutPageIndex = false
        } else {
          this.cutPageIndex = true
        }
      }
      return this.$store.state.cutPageM
    },
  },
  data () {
    return {
      cutPageIndex: true,
    }
  },
  created () {
    // console.log(...mapState())
    // if (localStorage.getItem('cutPageM')) {
    //   if (localStorage.getItem('cutPageM') == 'table') {
    //     console.log('wojinlai啦')
    //     this.cutPageIndex = false
    //   } else {
    //     this.cutPageIndex = true
    //   }
    // }
    // let username=this.$route.query.username||''
    // console.log('username',username)
    // if(username){
    //   window.scrollTo({
    //     x:0,
    //     y:0,
    //   })
    // }
   
  },
  mounted () {
    // setTimeout(()=>{
    if (localStorage.getItem('cutPageM')) {
      if (localStorage.getItem('cutPageM') == 'table') {
        this.cutPageIndex = false
      } else {
        this.cutPageIndex = true
      }
    }
    // },200)
    
  },
}
</script>

<style lang="less" scoped>
.container {
  .clearfix();
}
</style>
